<template>
  <view>
    <view class="smart-page-head">
      <view class="smart-page-head-title">checkbox,多选按钮</view>
    </view>
    <view class="smart-padding-wrap">
      <view class="item">
        <checkbox checked="true"></checkbox>
        选中
        <checkbox></checkbox>
        未选中
      </view>
      <view class="item">
        <checkbox checked="true" color="#F0AD4E" style="transform: scale(0.7);"></checkbox>
        选中
        <checkbox color="#F0AD4E" style="transform: scale(0.7);"></checkbox>
        未选中
      </view>
      <view class="item">
        推荐展示样式:
        <checkbox-group>
          <label class="list">
            <view>
              <checkbox></checkbox>
              中国
            </view>
          </label>
          <label class="list">
            <view>
              <checkbox></checkbox>
              美国
            </view>
          </label>
          <label class="list">
            <view>
              <checkbox></checkbox>
              日本
            </view>
          </label>
        </checkbox-group>
      </view>
    </view>
  </view>
</template>

<script>
export default {
	data(){
		return{};
	},
	methods:{}
};
</script>
<style>
.item {
  margin-bottom: 30rpx;
}
.list {
  justify-content: flex-start;
  padding: 22rpx 30rpx;
}
.list view {
  padding-bottom: 20rpx;
  border-bottom: 1px solid #d8d8d8;
}
</style>
